<template>
  <div class="home">
    <!-- :aa就是自定义属性 -->
    <!-- str没有动态绑定，就是常量  :动态绑定  绑定的是变量 -->

    <!-- 子传父 绑定自定义事件-->
    <son :aa="list" str="明天不补课" :num="n" :flag="f" @yy="fn" @mm="fn1"></son>
   <h2>{{ll}}</h2>
   <h1>{{message}}</h1>
  </div>
</template>

<script>
// @ is an alias to /src
import son from '@/components/son.vue'
import {reactive,toRefs} from 'vue'

export default {
//   name: 'HomeView',
setup(){
    const data = reactive({
        list:[1,2,3,4,5],
        n:10,
        f:false,
        ll:[],
        message:''
    })
    // val就是子组件传递过来的值
    const fn=(val)=>{
        console.log(val);
        console.log('888888');
        data.ll = val
    }
    const fn1 = (val)=>{
        console.log(val);
        data.message = val
        console.log('99999999');
    }
    return {...toRefs(data),fn,fn1}
},
  components: {
    son
  }
}
</script>
